<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>Document</title>
		<script src="./vue.global.js"></script>
		<link rel="stylesheet" href="./index.css" />
		<link rel="stylesheet" href="./table.css" />
		<link rel="stylesheet" href="./pugong.css" />
		<link rel="stylesheet" href="./utils.css" />
		<script src="./index.full.js"></script>

		<script>
			//适配代码
			(function(doc, win) {
				var docEI = doc.documentElement,
					resizeEvt =
					"orientationchange" in window ? "orientataionchange" : "resize",
					recalc = function() {
						var clientWidth = docEI.clientWidth;
						if (!clientWidth) return;
						//100是字体大小，1536是开发时浏览器窗口的宽度，等比计算
						docEI.style.fontSize = 100 * (clientWidth / 1536) + "px";
					};

				if (!doc.addEventListener) return;
				win.addEventListener(resizeEvt, recalc, false);
				doc.addEventListener("DOMContentLoaded", recalc, false);
			})(document, window);
		</script>
		<style>
			* {
				/* margin: 0;
        padding: 0; */
				font-size: 0.15rem;
			}
		</style>
	</head>

	<body>
		<div id="app" class="table-content text-left">
			<h3 class="text-center" style="font-size: 0.25rem">职业危害告知书</h3>
			<div class="text-indent mt-2">根据《中华人民共和国职业病防治法》第三十条的规定，本项目将工作过程中可能产生的职业病危害及其后果、职业病防护措施和待遇等如实告知您。</div>
			<div class="text-indent">1、粉尘</div>
			<div class="text-indent">（1）健康危害：长期接触粉尘的作业人员，当吸入的粉尘达到一定数量时即引发尘肺病。还可以引发鼻炎、咽炎、支气管炎、皮疹、皮炎、眼结膜损害等。</div>
			<div class="text-indent">（2）注意防护：必须佩戴个人防护用品，按时、按规定对身体状况进行定期检查，对除尘设施定期维护和检修，确保除尘设施运转正常。</div>
			<div class="text-indent">2、噪声</div>
			<div class="text-indent">（1）健康危害：致使听力减弱、下降，时间长可引起永久耳聋，并引发消化不良，呕吐、头痛、血压升高、失眠等全身性病症。</div>
			<div class="text-indent">（2）注意防护：利用吸声材料或吸声结构来吸收声能：佩戴耳塞、隔声间、隔声屏，将空气中传播的噪声挡住、隔开。</div>
			<div class="text-indent">3、电焊弧光</div>
			<div class="text-indent">（1）健康危害：将对视网膜产生烧灼，造成眩晕性视网膜炎。此时将感觉眼睛疼痛，
				视觉模糊，有中心暗点，一段时间后才能恢复。如长期反复作用，将逐渐使视力减退。</div>
			<div class="text-indent">（2）注意防护：第一是必须采用品质合格的焊接滤光片（黑玻璃）；第二是要增强个人的防护意识。</div>
			<div class="text-indent">4、高温</div>
			<div class="text-indent">（1）健康危害：对人体体温调节、水盐代谢等生理功能产生影响的同时， 还可导致中暑性疾病，如热射病、热痉挛、热衰竭。 </div>
			<div class="text-indent">（2）注意防护：合理安排高温作业工人的劳动和休息，保证高温作业工人有充足的睡眠与休息，供给合理的饮料和补充营养。加强个人防护，对职工进行有关高温作业防护知识的宣传教育。
			</div>
			<div class="text-indent">（3）应急处理：将患者移至阴凉、通风处，同时垫高头部、解开衣服， 用毛巾或冰块敷头部、腋窝等处，并及时送医院。</div>
			<div class="text-indent">5、全身振动</div>
			<div class="text-indent">（1）健康危害：全身振动可以对全身各系统产生影响，甚至是晕动病，又称晕车病。</div>
			<div class="text-indent">（2）注意防护：限制作业时间：制定合理的作息制度和工间休息；改善作业环境：控制工作场所的寒冷、噪声、毒物、高湿，特别是注意防寒保暖；加强个人防护，合理使用防护用品。</div>
	


			<div class="d-flex flex-row mt-2 justify-content-between">
				<div>
					<div @click="setUpEquipment('jobForm.announcer','TaskSignFinger')">
						告知者（签字）：
					</div>
					<el-image v-show="jobForm.announcer" class="sign_img" :src="jobForm.announcer" fit="fill"></el-image>
					<div>
						<el-input v-model="jobForm.year" class="people-input" placeholder=" " style="width: 0.8rem"></el-input>
						年
						<el-input v-model="jobForm.month" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
						月
						<el-input v-model="jobForm.day" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
						日
					</div>
				</div>
				<div>
					<div @click="setUpEquipment('jobForm.announcerd','TaskSignFinger')">
						被告知者（签字）：
					</div>
					<el-image v-show="jobForm.announcerd" class="sign_img" :src="jobForm.announcerd" fit="fill"></el-image>
					<div>
						<el-input v-model="jobForm.year1" class="people-input" placeholder=" " style="width: 0.8rem"></el-input>
						年
						<el-input v-model="jobForm.month1" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
						月
						<el-input v-model="jobForm.day1" class="people-input" placeholder=" " style="width: 0.5rem"></el-input>
						日
					</div>
				</div>
			</div>
		</div>
		<script>
			const {
				createApp,
				reactive,
				toRefs,
				ref,
				onMounted
			} = Vue;
			const vue3Composition = {
				setup() {
					const jobForm = ref({
						year: "",
						month: "",
						day: "",
						year1: "",
						month1: "",
						day1: "",
						announcer: "", //告知者
						announcerd: "", //被告知者
					});

					window.setSign = (event) => {
						jobForm.value[event.key] = event.img;
					};

					window.getData = (event) => {
						return jobForm.value;
					};
					window.setData = (data) => {
						jobForm.value = data;
					};

					//peopleForm.sign
					const setUpEquipment = (key, type) => {
						window.parent.childListener({
							key,
							type,
						});
					};
					return {
						jobForm,
						setUpEquipment,
					};
				},
			};
			const app = createApp(vue3Composition).use(ElementPlus).mount("#app");
		</script>
	</body>
</html>